<template>
  <view class="goods-recommend">
    <Form title="是否设为推荐商品">
      <FormItem label="设为推荐商品" style="text-align:right">
        <switch :checked="checked" size="small" class="goods-recommend__switch" @change="switch1Change" />
      </FormItem>
    </Form>
  </view>
</template>

<script>
import Form from "../../../components/public/Form/index.vue";
import FormItem from "../../../components/public/FormItem/index.vue";
import { mapState } from "vuex";
export default {
  components: { Form, FormItem },
  props: {
    mode: {
      type: String,
      default: () => "add" // add modify
    }
  },
  data() {
    return {
      formData: {
        isRecommend: 0
      }
    };
  },
  computed: {
    checked() {
      return this.formData.isRecommend == 1;
    },
    ...mapState({
      goodsInfo: state => state.goods.goodsInfo
    })
  },
  created() {
    if (this.goodsInfo.id && this.mode == "modify") this.init();
  },
  methods: {
    init() {
      for (const key in this.formData) {
        this.formData[key] = this.goodsInfo[key];
      }
    },
    switch1Change: function(e) {
      if (e.target.value) this.formData.isRecommend = 1;
      else this.formData.isRecommend = 0;
    },
    getData() {
      return this.formData;
    }
  }
};
</script>

<style scoped lang="scss">
.goods-recommend {
  .goods-recommend__switch {
    position: absolute;
    right: 0;
    top: -35rpx;
    // text-align: right;
  }
}
</style>
